export default {
    props: {
        initText: {
            type: String,
            default: ''
        }
    },
    data() {
        return {
            keywords: ''
        }
    },
    created() {
        this.keywords = this.initText
    },
    methods: {
        handleToSearch() {
            location.href = `./search.html?keywords=${this.keywords.trim()}`
        }
    },
    template: `
    <div class="header-out-search">
        <div class="header-search-input">
            <input v-model="keywords" type="text" placeholder="What are you looking for?" @keyup.enter="handleToSearch">
            <div class="header-search-input-icon" @click="handleToSearch">
                <img src="./imgs/search_white.svg" alt="search">
            </div>
        </div>
    </div>
    `
}